@import (reference) '~weaver-mobile/dist/weaver-mobile.less';
@import (reference) './index.less';

.blog {
  /* 底部菜单栏 */
  &-navBar {
    height: 100%;
    position: relative;
    .am-tab-bar {
      position: absolute;
      bottom: 0;
      width: 100%;
      height: @tab-bar-height;
    }
    .blog-tab-tintColor, .am-icon-blog-homepage, .am-icon-blog-bolg, .am-icon-blog-gengduo, .am-icon-blog-report-form-hot, .am-icon-blog-personal {
      color: @brand-primary;
    }
    .wm-route-layout >div{
      height: 100%;
    }
    &-hide {
      display: none;
    }
  }
  &-container {
    position: absolute;
    top: 0;
    width: 100%;
  }
  /* 列表页面样式 */
  &-list-line {
    display: flex;
    color: @color-text-paragraph;
    position: relative;
    &-userInfo {
      max-width: 70%;
      display: flex;
      flex: 1 1;
      &-content {
        width: calc(~'78% - '40 * @hd); // 改动头像大小需要改动该处数值
        padding-left: 3%;
        box-sizing: border-box;
        >span {
          display: block;
          overflow-x: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
        }
        .time {
          color: @color-text-placeholder;
        }
      }
    }
    &-ops {
      position: absolute;
      right: 30px;
      top: 11%;
      &-newattention {
        position: absolute;
        top: 2px;
        right: -12px;
        height: 36px;
        width: 40px;
        text-align: center;
        line-height: 30px;
      }
      .text-info {
        border: @border-width-sm solid @border-color-base;
        border-radius: @radius-sm;
        padding: 4 * @hd 7 * @hd;
        height: 30 * @hd;
        width: 85 * @hd;
        text-align: center;
        box-sizing: border-box;
        position: relative;
        top: 15%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        .am-icon {
          height: 12 * @hd;
          width: 12 * @hd;
          position: relative;
          top: 1px;
        }
        >span {
          font-size: @font-size-caption-sm;
          margin-left: 6 * @hd;
        }
      }
      .text-info.active {
        border-color: @brand-primary !important; /* important 后期可以看情况去掉 */
        color: @brand-primary !important;  /* important 后期可以看情况去掉 */
        .am-icon {
          color: @brand-primary !important;  /* important 后期可以看情况去掉 */
         
        }
        >span {
          color: @brand-primary !important;  /* important 后期可以看情况去掉 */
        }
      }
    }
  }
  &-shareToMeBlog {
    .wm-reply-wrap {
      left: ~"calc(300%)";
    }
  }

  &-unReadBlog {
    .wm-reply-wrap {
      left: ~"calc(100%)";
    }
  }

  &-specialBlog {
    .wm-reply-wrap {
      left: ~"calc(200%)";
    }
  }

  &-allBlog {
    .wm-reply-wrap {
      left: ~"calc(500%)";
    }
  }
  /* Comment 样式 */
  &-comment {
    height: 100%;
    .wm-reply-wrap {
      z-index: 9999;
      position: fixed;
    }
    
    // 右上角日期
    &-right-top {
      float: right;
      background-color: #DFF1FF;
      color: @brand-primary;
      font-size: @font-size-caption-sm;
      line-height: 17 * @hd;
      padding: 3 * @hd 9 * @hd;
      top: -10 * @hd;
      &-unread {
        float: right;
        margin-right: 10 * @hd;
      }
    }
    &-content{
      // 未提交样式
      &-unSubmit {
        text-align: center;
        padding-bottom: 18 * @hd;
        color: @color-text-caption;
        .am-icon-warning {
          position: relative;
          top: 4 * @hd;
          margin-right: 8 * @hd;
        }
      }
      // 补交样式
      &-supplement {
        color: @brand-warning;
        .am-icon-blog-bujiao {
          position: relative;
          top: 3 * @hd;
        }
        >span {
          font-size: 13 * @hd;
          line-height: 18 * @hd;
          margin-left: 7 * @hd;
        }
      } 
    }
    /* 写微博页面 */
    &-write {
      height: 100%;
      position: relative;
      &-container {
        position: absolute;
        top: 0;
        bottom: @button-height;
        display: flex;
        flex-direction: column;
        width: 100%;
        .wm-reply-bar {
          background: #f1f1f2;
        }
        table {
          table-layout: fixed;
          border-collapse: collapse;
        }
        td {
          word-break: break-all;
          border: 1px solid rgb(0, 0, 0);
        }


        .govern-home {


         .g-comForm {

           //.am-list-content  {
           //  border-bottom:0px !important;
           //}
           //.am-list-extra {
           //  border-bottom:0px !important;
           //}
           //.am-list-label {
           //  border-bottom:0px !important;
           //  border-right:0px !important;
           //  text-align: center;
           //  font-size: 15px;
           //}

         }

        }
        .shareitem {
          right: 9px;
          border: 1px  solid #aeaeae;
          width: 76px;
          height: 28px;
          bottom: 49px;
          .shareitemname{
            font-size: 12px;
            padding: 8px 3px;
            display: block;
            color: #302e2e;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
          }
        }

        .wm-ck-rich-text-editor-content {
          bottom: 25 * @hd;
        }
        &-position {
          position: absolute;
          bottom: @list-item-height;
          height: 25 * @hd;

          .am-icon-location, &-name {
            color: #888;
          }
          .am-icon-position, &-name.active {
            color: @brand-primary;
          }
        }
      }
      .am-rich-editor {
        height: 100%;
        .quill {
          height: 100%;
          .ql-editor {
            height: 100%;
          }
        }
      }
      .bottombtn {
        position: absolute;
        bottom: 0;
        width: 100%;
        border-radius: 0;
      }
    }
  }
  /* 全选样式 */
  &-checked-top {
    height: @list-item-height;
    line-height: @list-item-height;
    border-bottom: @border-width-sm solid @border-color-base;
    box-sizing: border-box;
    &-cancel {
      color: @brand-primary;
      padding-left: @v-spacing-lg;
      padding-right: 18 * @hd;
    }
    &-all {
      position: absolute;
      right: 0;
      padding-right: @v-spacing-lg;
    }
  }
  /* Loading 页面样式 */
  &-loading {
    height: 100%;
    background: @fill-base;
    position: relative;
    &-content {
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -44 * @hd;
      margin-left: -31 * @hd;
      padding-bottom: 10 * @hd;
    }
    .am-activity-indicator {
      justify-content: center;
    }
  }
  /* 暂无数据页面样式 */
  &-noData {
    height: 100%;
    background: @fill-base;
    position: relative;
    .am-result {
      padding-top: 0;
      padding-bottom: 0;
      border: none;
      position: absolute;
      top: 50%;
      margin-top: -81 * @hd;
      &-message {
        font-size: 14px;
      }
      .am-icon-no-data {
        color: #888;
        width: 60 * @hd;
        height: 60 * @hd;
      }
    }
  }
  /* 无权限页面样式 */
  &-wuquanxian {
    .am-result {
      padding-top: 0;
      padding-bottom: 0;
      border: none;
      position: absolute;
      top: 50%;
      margin-top: -205 * @hd;
      .am-result-pic {
        width: 108 * @hd;
        height: 81 * @hd;
        line-height: 81 * @hd;
        .am-icon-wuquanxian {
          width: 108 * @hd;
          height: 81 * @hd;
        }
      }
      .am-result-message {
        color: @color-text-paragraph;
        margin-top: 21 * @hd;
        margin-bottom: 35 * @hd;
      }
      .am-result-button {
        .am-button {
          border: none;
          height: 30 * @hd;
          width: 85 * @hd;
          font-size: @font-size-caption-sm;
          line-height: 17 * @hd;
          margin: 0 auto;
          .text-info {
            border: @border-width-sm solid @border-color-base;
            border-radius: @radius-sm;
            padding: 6 * @hd 7 * @hd 4 * @hd 7 * @hd;
            height: 30 * @hd;
            text-align: center;
            box-sizing: border-box;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            .am-icon {
              height: 12 * @hd;
              width: 12 * @hd;
              position: relative;
              top: 1px;
            }
            >span {
              font-size: @font-size-caption-sm;
              margin-left: 6 * @hd;
            }
          }
          .text-info.active {
            border-color: @brand-primary !important; /* important 后期可以看情况去掉 */
            color: @brand-primary !important;  /* important 后期可以看情况去掉 */
            .am-icon {
              color: @brand-primary !important;  /* important 后期可以看情况去掉 */
            }
            >span {
              color: @brand-primary !important;  /* important 后期可以看情况去掉 */
            }
          }
        }
      }
    }
  }
}